/*
 * @Author: samfeng
 * @Date: 2021-04-18 11:33:02
 * @LastEditTime: 2021-05-01 23:14:08
 * @LastEditors: Please set LastEditors
 * @Description: 点餐界面左边展示
 * @FilePath: /first_flutter_app/lib/views/orderPage/orderLeftPage.dart
 */

// import 'package:first_flutter_app/constant/dataInfo.dart';
import 'package:first_flutter_app/controller/orderPageController.dart';
import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:get/get.dart';

class PaymentLeftPage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Container(
      width: 500.w,
      // height: ScreenUtil().setHeight(300),
      decoration: BoxDecoration(
        border: Border.all(color: Colors.black12, width: 0.5),
      ),
      child: Column(
        children: [orderTopTitel(), doubleButton()],
      ),
    );
  }
}

// 头部展示
class orderTopTitel extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Container(
      child: GetBuilder<OrderController>(
        init: OrderController(),
        builder: (_) => Column(
          children: [titleShow(), orderProductsPage()],
        ),
      ),
    );
  }
}

// 第一部分
class titleShow extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Container(
      child: Column(
        children: [
          Container(
            height: 200.h,
            color: Colors.blueAccent[400],
            child: Row(
              mainAxisAlignment: MainAxisAlignment.start,
              children: [
                _backBtn(), // 返回
                _tableTxtShow(), // 桌台文字
                _money(), // 更多
              ],
            ),
          ),
        ],
      ),
    );
  }

  Widget _backBtn() {
    return Container(
      // margin: EdgeInsets.only(left: ScreenUtil().setSp(30)),
      height: 150.h,
      width: 150.w,
      // alignment: Alignment.centerLeft,
      // margin: EdgeInsets.only(
      //   left: ScreenUtil().setSp(10),
      // ),
      decoration: BoxDecoration(
        shape: BoxShape.circle,
        border: Border.all(color: Colors.white, width: 1.5),
      ),
      child: InkWell(
        onTap: () {
          Get.back();
        },
        child: Center(
          child: Text(
            "<",
            style: TextStyle(
              color: Colors.white,
              fontSize: ScreenUtil().setSp(100),
            ),
          ),
        ),
      ),
    );
  }

  Widget _tableTxtShow() {
    return Container(
      padding: EdgeInsets.only(
        left: 50.w,
        top: 50.h
      ),
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          Text(
            "支付单",
            style: TextStyle(
                fontSize: ScreenUtil().setSp(60), color: Colors.white),
          ),
          Text(
            OrderController.oc.tableList[OrderController.oc.currentSelectTableIndex]['tableName'],
            style: TextStyle(
                fontSize: ScreenUtil().setSp(40), color: Colors.white),
          ),
        ],
      ),
    );
  }

  Widget _money() {
    return Container(
      padding: EdgeInsets.only(
        left: 80.w
      ),
      child: Center(
        child: Text(
          "￥${OrderController.oc.amountTotal.toString()}",
          style: TextStyle(
            color: Colors.white,
            fontSize: ScreenUtil().setSp(80),
          ),
        ),
      ),
    );
  }
}

//点餐菜品展示页面
class orderProductsPage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Container(
      width: ScreenUtil().setWidth(490),
      // height: ScreenUtil().setHeight(1170),
      padding: EdgeInsets.only(
        bottom: ScreenUtil().setSp(60),
      ),
      // decoration: BoxDecoration(
      //   border: Border.all(
      //     color: Colors.black12,
      //     width: 0.5,
      //   ),
      //   borderRadius: BorderRadius.only(
      //       bottomLeft: Radius.circular(4.0),
      //       bottomRight: Radius.circular(4.0)),
      // ),
      child: Column(
        mainAxisAlignment: MainAxisAlignment.start,
        children: [
          _productListShow(context),
          _bottomTotalCount(),
        ],
      ),
    );
  }

  // 菜品展示page
  Widget _productListShow(BuildContext context) {
    return Container(
      height: 1310.h,
      child: MediaQuery.removePadding(
        context: context,
        removeTop: true,
        child: ListView.builder(
          shrinkWrap: true,
          itemBuilder: (context, index) {
            return GetBuilder<OrderController>(
              builder: (_) => InkWell(
                onLongPress: () {
                  OrderController.oc.setSelectShow();
                },
                onTap: () {
                  OrderController.oc.setProductListChangeColorsIndex(index);
                },
                onDoubleTap: () {
                  OrderController.oc.cleanProductListChangeColorsIndex();
                },
                child: Container(
                  decoration: BoxDecoration(
                    border: Border(
                      bottom: BorderSide(
                        width: 1.5,
                        color: Color.fromRGBO(233, 236, 239, 1),
                      ),
                      top: BorderSide(
                        width: 1.5,
                        color: Color.fromRGBO(233, 236, 239, 1),
                      ),
                    ),
                    // color:
                    //     OrderController.oc.productListChangeColorsIndex == index
                    //         ? Colors.black12
                    //         : null,
                  ),
                  padding: EdgeInsets.only(
                    left: ScreenUtil().setSp(20),
                    top: ScreenUtil().setSp(15),
                    right: ScreenUtil().setSp(20),
                    bottom: ScreenUtil().setSp(15),
                  ),
                  child: Row(
                    mainAxisAlignment: MainAxisAlignment.spaceBetween,
                    children: [
                      Container(
                        child: Row(
                          mainAxisAlignment: MainAxisAlignment.spaceBetween,
                          children: [
                            Offstage(
                              offstage: OrderController.oc.selectShow,
                              child: InkWell(
                                focusColor: Colors.black54,
                                onTap: () {
                                  OrderController.oc
                                      .updateSelectProductList(index);
                                },
                                child: Container(
                                  alignment: Alignment.center,
                                  width: ScreenUtil().setWidth(50),
                                  height: ScreenUtil().setHeight(50),
                                  decoration: BoxDecoration(
                                    shape: BoxShape.circle,
                                    // color: OrderController.oc
                                    //         .currentSelectTable['orderDetail'][index]['selected']
                                    //     ? Colors.blue
                                    //     : Colors.black26,
                                  ),
                                  child: Container(
                                    decoration: BoxDecoration(
                                        shape: BoxShape.circle,
                                        color: Colors.white),
                                    child: Icon(
                                      Icons.panorama_fish_eye_rounded,
                                      size: ScreenUtil().setSp(20),
                                      color: Colors.white,
                                    ),
                                  ),
                                ),
                              ),
                            ),
                            Container(
                              alignment: Alignment.center,
                              width: 140.w,
                              margin:
                                  EdgeInsets.only(left: ScreenUtil().setSp(10)),
                              child: Text(
                                OrderController.oc.tableList[OrderController.oc.currentSelectTableIndex]['orderDetail'][index]
                                    ['productName'],
                                maxLines: 1,
                                overflow: TextOverflow.ellipsis,
                                style: TextStyle(
                                  fontSize: ScreenUtil().setSp(60),
                                  fontWeight: FontWeight.w800,
                                  color: Colors.black45,
                                ),
                              ),
                            ),
                          ],
                        ),
                      ),
                      Container(
                        child: Text(
                          'x ${OrderController.oc.tableList[OrderController.oc.currentSelectTableIndex]['orderDetail'][index]['qty']}',
                          style: TextStyle(
                            fontSize: ScreenUtil().setSp(50),
                            color: Colors.black45,
                          ),
                        ),
                      ),
                      Container(
                        child: Text(
                          OrderController.oc.tableList[OrderController.oc.currentSelectTableIndex]['orderDetail'][index]
                                  ['currency'] +
                              OrderController.oc.tableList[OrderController.oc.currentSelectTableIndex]['orderDetail'][index]['price']
                                  .toString(),
                          style: TextStyle(
                            fontSize: ScreenUtil().setSp(50),
                            color: Colors.black45,
                          ),
                        ),
                      ),
                    ],
                  ),
                ),
              ),
            );
          },
          itemCount: OrderController.oc.tableList[OrderController.oc.currentSelectTableIndex]['orderDetail'].length,
        )
      ),
    );
  }

  Widget _bottomTotalCount() {
    return Container(
      margin: EdgeInsets.only(top: ScreenUtil().setSp(20)),
      child: Row(
        children: [
          Container(
            child: Text(
              "合计:",
              style: TextStyle(
                fontSize: ScreenUtil().setSp(50),
                fontWeight: FontWeight.w800,
                color: Colors.black45,
              ),
            ),
          ),
          Container(
            child: Text(
              OrderController.oc.currentSelectTable['orderDetail'].length.toString(),
              style: TextStyle(
                fontSize: ScreenUtil().setSp(55),
                color: Colors.blue,
              ),
            ),
          ),
        ],
      ),
    );
  }
}

// 底部按钮
class doubleButton extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Container(
      padding: EdgeInsets.only(top: 30.h),
      margin: EdgeInsets.only(
        left: 30.sp,
        right: 30.sp,
        bottom: 30.sp,
      ),
      decoration: BoxDecoration(
        border: Border(
          top: BorderSide(
            color: Color.fromRGBO(233, 236, 239, 1),
          ),
        ),
      ),
      child: Row(
        mainAxisAlignment: MainAxisAlignment.spaceBetween,
        children: [
          ElevatedButton(
            onPressed: () {},
            style: ButtonStyle(
              backgroundColor: MaterialStateProperty.resolveWith((states) {
                //设置按下时的背景颜色
                if (states.contains(MaterialState.pressed)) {
                  return Colors.green;
                }
                //默认不使用背景颜色
                return Colors.green;
              }),
            ),
            child: Row(
              mainAxisAlignment: MainAxisAlignment.spaceBetween,
              children: [
                Container(
                  width: 150.w,
                  height: 150.h,
                  alignment: Alignment.center,
                  child: Text(
                    "拆单支付",
                    style: TextStyle(
                      color: Colors.white,
                      fontSize: ScreenUtil().setSp(70),
                    ),
                  ),
                ),
              ],
            ),
          ),
          ElevatedButton(
            onPressed: () {},
            style: ButtonStyle(
              // minimumSize: MaterialStateProperty.all(Size(150, 0)),
              backgroundColor: MaterialStateProperty.resolveWith((states) {
                //设置按下时的背景颜色
                if (states.contains(MaterialState.pressed)) {
                  return Colors.blue[800];
                }
                //默认不使用背景颜色
                return Colors.blue[600];
              }),
            ),
            child: Row(
              mainAxisAlignment: MainAxisAlignment.spaceBetween,
              children: [
                Container(
                  // margin: EdgeInsets.only(left: ScreenUtil().setSp(50)),
                  decoration: BoxDecoration(
                    borderRadius: BorderRadius.circular(150),
                    color: Color.fromRGBO(63, 109, 204, 1),
                  ),
                  child: Icon(
                    Icons.print,
                    color: Colors.white,
                    size: 75.sp,
                  ),
                ),
                GetBuilder<OrderController>(
                  builder: (_) => Container(
                    margin: EdgeInsets.only(
                      left: ScreenUtil().setSp(50),
                    ),
                    width: 115.w,
                    height: 150.h,
                    alignment: Alignment.centerLeft,
                    child: Text(
                      "预结单",
                      style: TextStyle(
                        color: Colors.white,
                        fontSize: ScreenUtil().setSp(75),
                      ),
                    ),
                  ),
                ),
              ],
            ),
          ),
        ],
      ),
    );
  }
}
